//商店基本设置
import React from "react";
import "./css/storeBasicSet.css";
import "./css/StoreInfo.css";
import { Form, Input, Button, Radio, Upload } from "antd";
import { UploadOutlined } from "@ant-design/icons";
import HOCStoreBasicSet from "../../component/set/HOC/HOCStoreBasicSet.js";

const layout = {
  labelCol: { span: 8 },
  wrapperCol: { span: 10 },
};

@HOCStoreBasicSet
class StoreBasicSet extends React.Component {
  render() {
    let { beforeUploadImg, bsDgpd, bsDpd, handleRemove, submit } = this.props;
    return (
      <div className="store-basic-set storeInfo">
        <div className="set-item">
          <Form {...layout} name="formOne" ref="formOne">
            <Form.Item
              label="网站域名"
              name="bsWebname"
              rules={[{ required: true, message: "请填写网站域名" }]}
            >
              <Input />
            </Form.Item>
            <Form.Item
              label="安装目录"
              name="bsInstall"
              rules={[{ required: true, message: "请填写安装目录" }]}
            >
              <Input />
            </Form.Item>
            <Form.Item
              label="引导关注链接"
              name="bsLain"
              rules={[{ required: true, message: "请填写引导关注链接" }]}
            >
              <Input />
            </Form.Item>
            <Form.Item
              label="启用库存"
              name="bsEi"
              rules={[{ required: true, message: "请填写库存名称" }]}
            >
              <Input />
            </Form.Item>
            <Form.Item
              label="消费积分名称"
              name="bsCpname"
              rules={[{ required: true, message: "请填写积分名称" }]}
            >
              <Input />
            </Form.Item>
            <Form.Item
              label="商品货号前缀"
              name="bsInp"
              rules={[{ required: true, message: "请填写商品货号前缀" }]}
            >
              <Input />
            </Form.Item>
            <div className="formTwo">
              <Form.Item
                label="评论审核"
                name="bsReviewStatus"
                rules={[{ required: true, message: "请选择" }]}
              >
                <Radio.Group>
                  <Radio value={1}>不需要审核</Radio>
                  <Radio value={2}>需要审核</Radio>
                </Radio.Group>
              </Form.Item>
            </div>
            <div className="formTwo">
              <Form.Item
                label="商品默认图"
                name="bsDgpd"
                rules={[{ required: true, message: "请上传电脑端logo" }]}
              >
                <Upload
                  action=""
                  listType="picture"
                  className="upload-list-inline"
                  fileList={bsDgpd}
                  beforeUpload={(file) => beforeUploadImg(file, "bsDgpd")}
                  onRemove={(file) => handleRemove(file, "bsDgpd")}
                >
                  <Button icon={<UploadOutlined />}>Upload</Button>
                </Upload>
              </Form.Item>
            </div>
          </Form>
        </div>
        <div className="set-item">
          <Form {...layout} name="formTwo" ref="formTwo">
            <div className="formTwo">
              <Form.Item
                label="团购默认图"
                name="bsDpd"
                rules={[{ required: true, message: "请上传电脑端logo" }]}
              >
                <Upload
                  action=""
                  listType="picture"
                  className="upload-list-inline"
                  fileList={bsDpd}
                  beforeUpload={(file) => beforeUploadImg(file, "bsDpd")}
                  onRemove={(file) => handleRemove(file, "bsDpd")}
                >
                  <Button icon={<UploadOutlined />}>Upload</Button>
                </Upload>
              </Form.Item>
            </div>
            <Form.Item
              label="缓存时间"
              name="bsCtime"
              rules={[{ required: true, message: "请填写成团时间" }]}
            >
              <Input className="info-border" placeholder="以秒为单位"></Input>
            </Form.Item>
            <div className="formTwo formTwoBorder">
              <Form.Item label="统计代码" name="bsSc">
                <Input.TextArea
                  className="info-border"
                  maxLength={30}
                ></Input.TextArea>
              </Form.Item>
            </div>
            <div className="formTwo">
              <Form.Item
                label="是否启用Gzip模式"
                name="bsGzipmode"
                rules={[{ required: true, message: "请选择" }]}
              >
                <Radio.Group>
                  <Radio value={1}>禁用</Radio>
                  <Radio value={2}>启用</Radio>
                </Radio.Group>
              </Form.Item>
            </div>
            <div className="formTwo">
              <Form.Item
                label="排行统计"
                name="bsRs"
                rules={[{ required: true, message: "请选择" }]}
              >
                <Radio.Group>
                  <Radio value={1}>所有</Radio>
                  <Radio value={2}>一年</Radio>
                  <Radio value={3}>半年</Radio>
                  <Radio value={4}>三个月</Radio>
                  <Radio value={5}>一个月</Radio>
                </Radio.Group>
              </Form.Item>
            </div>
            <Form.Item
              label="默认库存"
              name="bsDi"
              rules={[{ required: true, message: "请填写默认库存" }]}
            >
              <Input className="info-border"></Input>
            </Form.Item>
            <div className="formTwo">
              <Form.Item
                label="物流跟踪"
                name="bsLiStatus"
                rules={[{ required: true, message: "请选择" }]}
              >
                <Radio.Group>
                  <Radio value={1}>需要开启</Radio>
                  <Radio value={2}>不需要开启</Radio>
                </Radio.Group>
              </Form.Item>
            </div>
          </Form>
          <div className="btn">
            <Button onClick={submit}>确定</Button>
          </div>
        </div>
      </div>
    );
  }
}

export default StoreBasicSet;
